<!--
 * @Author: lp
 * @Date: 2022-01-17 10:11:34
 * @LastEditTime: 2022-05-26 09:27:35
 * @LastEditors: lp 654528967@qq.com
 * @Description: 404页面
 * @FilePath: \nien-vue3-admin\src\views\404.vue
-->
<template>
  <div class="container">
    <div class="main">
      <div class="img-container">
        <img
          src="http://aknien.net:2135/public/html/images/feedback-404.png" 
          srcset="http://aknien.net:2135/public/html/images/feedback-404@2x.png 2x,http://aknien.net:2135/public/html/images/feedback-404@3x.png 3x,"
        />
      </div>
      <h2 class="title">抱歉，你访问的页面不存在</h2>
      <router-link to="index">
        <el-button class="btn" type="primary" @click="$router.push('index')">返回首页</el-button>
      </router-link>
    </div>
  </div>
</template>
<script lang="ts" setup></script>
<style lang="less" scoped>
.container {
  height: 100%;
  padding: 16px;
  .main {
    height: 100%;
    background-color: #fff;
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    align-items: center;
    .img-container {
      margin-top: 93px;
      width: 560px;
      height: 298px;
      img {
        width: 100%;
      }
    }
    .title {
      font-size: 20px;
      color: #7a8298;
      margin: 0;
      margin-top: 45px;
    }
    .btn {
      margin-top: 24px;
    }
  }
}
</style>
